<template>
	<div class="left-bar"> 
		<ul> 
			<li><a href="#"><i class="icon iconfont icon-shouyin"></i> 收 银 </a></li> 
			<li><a href="#"><i class="icon iconfont icon-huiyuan"></i>会员</a></li> 
			<li><a href="#"><i class="icon iconfont icon-navicon-kczb"></i> 库 存 </a></li> 
			<li><a href="#"><i class="icon iconfont icon-jiaohuan"></i>换班</a></li> 
			<li><a href="#"><i class="icon iconfont icon-biaoge"></i>报表</a></li> 
			<li><a href="#"><i class="icon iconfont icon-ceshifuzhu"></i> 辅 助 </a></li> 
			<li @click="loginOut"><a href="javascript:void(0)"><i class="icon iconfont icon-tuichu"></i>退出</a></li>
		</ul> 
	</div> 
</template>

<script>
	export default{
		name: 'LeftNav', 
		methods: { 
			loginOut(){ // 点击退出功能 
				console.log(111)
				localStorage.removeItem('tokenID') 
				this.$message('退出成功!');
				this.$router.push('/')
			}
		}
	}
</script>

<style>
	.pos{overflow: hidden;}
	.left-bar{
		float: left;
		width: 75px;
		text-align: center;
		background: #1099fe;
		height: 753px;
	}
	.left-bar li{
		position: relative;
		height: 75px;
		display: block;
		padding-top: 45px;
		border-bottom: 1px solid white;
	}
	.left-bar li i{
		position: absolute;
		top: 18px;
		left: 25px;
		font-size: 24px;
		color: white;
	}
	.left-bar li:last-child i{
		left: 18px;
	}
	.left-bar li:first-child{
		background: #f62350;
	}
	.left-bar li a{
		color: white;
		display: block;
		z-index: 100;
	}
</style>